﻿{% extends 'base1.html' %}

{% block title %}
	Map
{% endblock %}

{% block page %}
		<!-- page -->
    <div data-role="page" id="map">
	
		<!-- entete -->
		<div data-role="header">
			<h1>Map</h1>
			<a data-rel="back">Back</a>
			<a href="../../" data-icon="home">Home</a>
		</div>
		
		<!-- contenu -->
		<div data-role="content" id="contenu"> 
			<script type="text/javascript" >
				for(var $i = 0 ;$i < years.length ; $i++ ){
					$("#select-choice-1").append("<option value='"+years[$i]+"'>"+years[$i]+"</option>");
				}
			</script>
			<div class="ui-grid-a" style="width:100%">
					<div class="ui-block-a" style="width:100%">
						<label for="select-choice-1" class="select"> Année :</label>
						<select name="select-choice-1" id="select-choice-1">
						</select>
					</div>
			</div>
			<script type="text/javascript" src="/media/js/depCoordinates.js"></script>
			<script type="text/javascript" src="/media/js/map.js"></script>
			
			<div class="ui-bar-c ui-corner-all ui-shadow" style="padding:3px;">
				<div id="map_canvas" style="min-height:400px;" ></div>
			</div>
			<div class="ui-grid-a" style="width:100%">
				<div class="ui-block-a" id ="detail" style="width:100%">
				</div>
			</div>
		</div>

		<!-- footer -->
		<div data-role="footer">
		 <br>
		 <br>
		</div>
		
	</div>
{% endblock %}